import React from 'react';
import { Container, Row, Col, Card, Button } from 'react-bootstrap';
import { Link } from 'react-router-dom';
import AuthService from '../services/AuthService';

const Home = () => {
  const currentUser = AuthService.getCurrentUser();
  
  return (
    <Container className="py-5">
      <Row className="justify-content-center">
        <Col md={8} lg={6}>
          <Card className="shadow-sm">
            <Card.Body className="p-5 text-center">
              <h1 className="mb-4">欢迎使用待办事项管理系统</h1>
              <p className="lead mb-4">
                这是一个基于微服务架构的待办事项管理系统，帮助您高效管理日常任务。
              </p>
              
              {currentUser ? (
                <Button 
                  as={Link} 
                  to="/todos" 
                  variant="success" 
                  size="lg"
                  className="px-4"
                  style={{backgroundColor: '#2e7d32', borderColor: '#2e7d32'}}
                >
                  查看我的任务
                </Button>
              ) : (
                <div className="d-flex justify-content-center gap-3">
                  <Button 
                    as={Link} 
                    to="/login" 
                    variant="success" 
                    size="lg"
                    className="px-4"
                    style={{backgroundColor: '#2e7d32', borderColor: '#2e7d32'}}
                  >
                    登录
                  </Button>
                  <Button 
                    as={Link} 
                    to="/register" 
                    variant="outline-success" 
                    size="lg"
                    className="px-4"
                    style={{borderColor: '#2e7d32', color: '#2e7d32'}}
                  >
                    注册
                  </Button>
                </div>
              )}
            </Card.Body>
          </Card>
          
          <Card className="mt-4 shadow-sm">
            <Card.Body className="p-4">
              <h3 className="mb-3">系统特点</h3>
              <ul className="list-unstyled">
                <li className="mb-2">✅ 基于微服务架构的可扩展设计</li>
                <li className="mb-2">✅ 安全的用户认证和授权机制</li>
                <li className="mb-2">✅ 简洁美观的用户界面</li>
                <li className="mb-2">✅ 方便的任务管理功能</li>
              </ul>
            </Card.Body>
          </Card>
        </Col>
      </Row>
    </Container>
  );
};

export default Home; 